import { createRouter, createWebHashHistory } from 'vue-router'
import type { RouteRecordRaw } from 'vue-router'
import type { App } from 'vue'
import { Layout, getParentLayout } from '@/utils/routerHelper'
import { useI18n } from '@/hooks/web/useI18n'

const { t } = useI18n()

export const constantRouterMap: AppRouteRecordRaw[] = [
  {
    path: '/',
    component: Layout,
    redirect: '/home/home',
    name: 'Root',
    meta: {
      hidden: true
    }
  },
  {
    path: '/redirect',
    component: Layout,
    name: 'Redirect',
    children: [
      {
        path: '/redirect/:path(.*)',
        name: 'Redirect',
        component: () => import('@/views/Redirect/Redirect.vue'),
        meta: {}
      }
    ],
    meta: {
      hidden: true,
      noTagsView: true
    }
  },
  {
    path: '/login',
    component: () => import('@/views/Login/Login.vue'),
    name: 'Login',
    meta: {
      hidden: true,
      title: t('router.login'),
      noTagsView: true
    }
  },
  {
    path: '/404',
    component: () => import('@/views/Error/404.vue'),
    name: 'NoFind',
    meta: {
      hidden: true,
      title: '404',
      noTagsView: true
    }
  }
]
//本地
const localRouter = [{
  path: '/dashboard',
  component: Layout,
  redirect: '/dashboard/analysis',
  name: 'Dashboard',
  meta: {
    title: t('router.dashboard'),
    icon: 'ant-design:dashboard-filled',
    alwaysShow: true
  },
  children: [
    {
      path: 'analysis',
      component: () => import('@/views/Dashboard/Analysis.vue'),
      name: 'Analysis',
      meta: {
        title: '分析仪',
        noCache: true,
        affix: true
      }
    },
    {
      path: 'workplace',
      component: () => import('@/views/Dashboard/Workplace.vue'),
      name: 'Workplace',
      meta: {
        title: t('router.workplace'),
        noCache: true
      }
    }
  ]
},
{
  path: '/external-link',
  component: Layout,
  meta: {},
  name: 'ExternalLink',
  children: [
    {
      path: 'https://element-plus-admin-doc.cn/',
      name: 'DocumentLink',
      meta: {
        title: t('router.document'),
        icon: 'clarity:document-solid'
      }
    }
  ]
},
{
  path: '/guide',
  component: Layout,
  name: 'Guide',
  meta: {},
  children: [
    {
      path: 'index',
      component: () => import('@/views/Guide/Guide.vue'),
      name: 'GuideDemo',
      meta: {
        title: t('router.guide'),
        icon: 'cib:telegram-plane'
      }
    }
  ]
},
{
  path: '/components',
  component: Layout,
  name: 'ComponentsDemo',
  meta: {
    title: t('router.component'),
    icon: 'bx:bxs-component',
    alwaysShow: true
  },
  children: [
    {
      path: 'form',
      component: getParentLayout(),
      redirect: '/components/form/default-form',
      name: 'Form',
      meta: {
        title: t('router.form'),
        alwaysShow: true
      },
      children: [
        {
          path: 'default-form',
          component: () => import('@/views/Components/Form/DefaultForm.vue'),
          name: 'DefaultForm',
          meta: {
            title: t('router.defaultForm')
          }
        },
        {
          path: 'use-form',
          component: () => import('@/views/Components/Form/UseFormDemo.vue'),
          name: 'UseForm',
          meta: {
            title: 'UseForm'
          }
        },
        {
          path: 'ref-form',
          component: () => import('@/views/Components/Form/RefForm.vue'),
          name: 'RefForm',
          meta: {
            title: 'RefForm'
          }
        }
      ]
    },
    {
      path: 'table',
      component: getParentLayout(),
      redirect: '/components/table/default-table',
      name: 'TableDemo',
      meta: {
        title: t('router.table'),
        alwaysShow: true
      },
      children: [
        {
          path: 'default-table',
          component: () => import('@/views/Components/Table/DefaultTable.vue'),
          name: 'DefaultTable',
          meta: {
            title: t('router.defaultTable')
          }
        },
        {
          path: 'use-table',
          component: () => import('@/views/Components/Table/UseTableDemo.vue'),
          name: 'UseTable',
          meta: {
            title: 'UseTable'
          }
        },
        {
          path: 'ref-table',
          component: () => import('@/views/Components/Table/RefTable.vue'),
          name: 'RefTable',
          meta: {
            title: 'RefTable'
          }
        }
      ]
    },
    {
      path: 'editor-demo',
      component: getParentLayout(),
      redirect: '/components/editor-demo/editor',
      name: 'EditorDemo',
      meta: {
        title: t('router.editor'),
        alwaysShow: true
      },
      children: [
        {
          path: 'editor',
          component: () => import('@/views/Components/Editor/Editor.vue'),
          name: 'Editor',
          meta: {
            title: t('router.richText')
          }
        }
      ]
    },
    {
      path: 'search',
      component: () => import('@/views/Components/Search.vue'),
      name: 'Search',
      meta: {
        title: t('router.search')
      }
    },
    {
      path: 'descriptions',
      component: () => import('@/views/Components/Descriptions.vue'),
      name: 'Descriptions',
      meta: {
        title: t('router.descriptions')
      }
    },
    {
      path: 'image-viewer',
      component: () => import('@/views/Components/ImageViewer.vue'),
      name: 'ImageViewer',
      meta: {
        title: t('router.imageViewer')
      }
    },
    {
      path: 'dialog',
      component: () => import('@/views/Components/Dialog.vue'),
      name: 'Dialog',
      meta: {
        title: t('router.dialog')
      }
    },
    {
      path: 'icon',
      component: () => import('@/views/Components/Icon.vue'),
      name: 'Icon',
      meta: {
        title: t('router.icon')
      }
    },
    {
      path: 'echart',
      component: () => import('@/views/Components/Echart.vue'),
      name: 'Echart',
      meta: {
        title: t('router.echart')
      }
    },
    {
      path: 'count-to',
      component: () => import('@/views/Components/CountTo.vue'),
      name: 'CountTo',
      meta: {
        title: t('router.countTo')
      }
    },
    {
      path: 'qrcode',
      component: () => import('@/views/Components/Qrcode.vue'),
      name: 'Qrcode',
      meta: {
        title: t('router.qrcode')
      }
    },
    {
      path: 'highlight',
      component: () => import('@/views/Components/Highlight.vue'),
      name: 'Highlight',
      meta: {
        title: t('router.highlight')
      }
    },
    {
      path: 'infotip',
      component: () => import('@/views/Components/Infotip.vue'),
      name: 'Infotip',
      meta: {
        title: t('router.infotip')
      }
    },
    {
      path: 'input-password',
      component: () => import('@/views/Components/InputPassword.vue'),
      name: 'InputPassword',
      meta: {
        title: t('router.inputPassword')
      }
    },
    {
      path: 'sticky',
      component: () => import('@/views/Components/Sticky.vue'),
      name: 'Sticky',
      meta: {
        title: t('router.sticky')
      }
    }
  ]
},
{
  path: '/hooks',
  component: Layout,
  redirect: '/hooks/useWatermark',
  name: 'Hooks',
  meta: {
    title: 'hooks',
    icon: 'ic:outline-webhook',
    alwaysShow: true
  },
  children: [
    {
      path: 'useWatermark',
      component: () => import('@/views/hooks/useWatermark.vue'),
      name: 'UseWatermark',
      meta: {
        title: 'useWatermark'
      }
    },
    {
      path: 'useCrudSchemas',
      component: () => import('@/views/hooks/useCrudSchemas.vue'),
      name: 'UseCrudSchemas',
      meta: {
        title: 'useCrudSchemas'
      }
    }
  ]
},
{
  path: '/level',
  component: Layout,
  redirect: '/level/menu1/menu1-1/menu1-1-1',
  name: 'Level',
  meta: {
    title: t('router.level'),
    icon: 'carbon:skill-level-advanced'
  },
  children: [
    {
      path: 'menu1',
      name: 'Menu1',
      component: getParentLayout(),
      redirect: '/level/menu1/menu1-1/menu1-1-1',
      meta: {
        title: t('router.menu1')
      },
      children: [
        {
          path: 'menu1-1',
          name: 'Menu11',
          component: getParentLayout(),
          redirect: '/level/menu1/menu1-1/menu1-1-1',
          meta: {
            title: t('router.menu11'),
            alwaysShow: true
          },
          children: [
            {
              path: 'menu1-1-1',
              name: 'Menu111',
              component: () => import('@/views/Level/Menu111.vue'),
              meta: {
                title: t('router.menu111')
              }
            }
          ]
        },
        {
          path: 'menu1-2',
          name: 'Menu12',
          component: () => import('@/views/Level/Menu12.vue'),
          meta: {
            title: t('router.menu12')
          }
        }
      ]
    },
    {
      path: 'menu2',
      name: 'Menu2',
      component: () => import('@/views/Level/Menu2.vue'),
      meta: {
        title: t('router.menu2')
      }
    }
  ]
},
{
  path: '/example',
  component: Layout,
  redirect: '/example/example-dialog',
  name: 'Example',
  meta: {
    title: t('router.example'),
    icon: 'ep:management',
    alwaysShow: true
  },
  children: [
    {
      path: 'example-dialog',
      component: () => import('@/views/Example/Dialog/ExampleDialog.vue'),
      name: 'ExampleDialog',
      meta: {
        title: t('router.exampleDialog')
      }
    },
    {
      path: 'example-page',
      component: () => import('@/views/Example/Page/ExamplePage.vue'),
      name: 'ExamplePage',
      meta: {
        title: t('router.examplePage')
      }
    },
    {
      path: 'example-add',
      component: () => import('@/views/Example/Page/ExampleAdd.vue'),
      name: 'ExampleAdd',
      meta: {
        title: t('router.exampleAdd'),
        noTagsView: true,
        noCache: true,
        hidden: true,
        canTo: true,
        activeMenu: '/example/example-page'
      }
    },
    {
      path: 'example-edit',
      component: () => import('@/views/Example/Page/ExampleEdit.vue'),
      name: 'ExampleEdit',
      meta: {
        title: t('router.exampleEdit'),
        noTagsView: true,
        noCache: true,
        hidden: true,
        canTo: true,
        activeMenu: '/example/example-page'
      }
    },
    {
      path: 'example-detail',
      component: () => import('@/views/Example/Page/ExampleDetail.vue'),
      name: 'ExampleDetail',
      meta: {
        title: t('router.exampleDetail'),
        noTagsView: true,
        noCache: true,
        hidden: true,
        canTo: true,
        activeMenu: '/example/example-page'
      }
    }
  ]
},
{
  path: '/error',
  component: Layout,
  redirect: '/error/404',
  name: 'Error',
  meta: {
    title: t('router.errorPage'),
    icon: 'ci:error',
    alwaysShow: true
  },
  children: [
    {
      path: '404-demo',
      component: () => import('@/views/Error/404.vue'),
      name: '404Demo',
      meta: {
        title: '404'
      }
    },
    {
      path: '403-demo',
      component: () => import('@/views/Error/403.vue'),
      name: '403Demo',
      meta: {
        title: '403'
      }
    },
    {
      path: '500-demo',
      component: () => import('@/views/Error/500.vue'),
      name: '500Demo',
      meta: {
        title: '500'
      }
    }
  ]
},
{
  path: '/authorization',
  component: Layout,
  redirect: '/authorization/user',
  name: 'Authorization',
  meta: {
    title: t('router.authorization'),
    icon: 'eos-icons:role-binding',
    alwaysShow: true
  },
  children: [
    {
      path: 'user',
      component: () => import('@/views/Authorization/User.vue'),
      name: 'User',
      meta: {
        title: t('router.user')
      }
    },
    {
      path: 'role',
      component: () => import('@/views/Authorization/Role.vue'),
      name: 'Role',
      meta: {
        title: t('router.role')
      }
    }
  ]
}]

export const asyncRouterMap: AppRouteRecordRaw[] = [
  {
    path: '/home',
    name: 'IHome',
    component: Layout,
    redirect: '/dashboard/analysis',
    meta: {
      title: '首页'
    },
    children: [
      {
        path: 'home',
        component: () => import('@/views/Home/Home.vue'),
        name: 'Home',
        meta: {
          title: '首页',
          icon: 'ant-design:dashboard-filled',
          noCache: true
        }
      }
    ]
  },
  {
    path: '/database',
    name: 'Database',
    component: Layout,
    meta: {
      title: '数据库'
    },
    children: [
      {
        path: 'index',
        component: () => import('@/views/Database/Database.vue'),
        name: 'DatabaseHome',
        meta: {
          title: '数据库',
          icon: 'cib:telegram-plane',
          noCache: true
        }
      }
    ]
  },
  {
    path: '/ftp',
    name: 'FTP',
    component: Layout,
    meta: {
      title: 'FTP'
    },
    children: [
      {
        path: 'index',
        component: () => import('@/views/FTP/FTP.vue'),
        name: 'FTPIndex',
        meta: {
          title: 'FTP',
          icon: 'clarity:document-solid',
          noCache: true
        }
      }
    ]
  },
  // {
  //   path: '/control',
  //   name: 'Control',
  //   component: Layout,
  //   meta: {
  //     title: '监控'
  //   },
  //   children: [
  //     {
  //       path: 'index',
  //       component: () => import('@/views/Control/Control.vue'),
  //       name: 'ControlIndex',
  //       meta: {
  //         title: '监控',
  //         icon: 'ant-design:dashboard-filled',
  //         noCache: true
  //       }
  //     }
  //   ]
  // },
  {
    path: '/btwaf',
    name: 'Btwaf',
    component: Layout,
    meta: {
      title: '防火墙'
    },
    children: [
      {
        path: 'index',
        component: () => import('@/views/Btwaf/Btwaf.vue'),
        name: 'BtwafIndex',
        meta: {
          title: '防火墙',
          icon: 'ic:outline-webhook',
          noCache: true
        }
      }
    ]
  },
  {
    path: '/soft',
    name: 'Soft',
    component: Layout,
    meta: {
      title: '软件商店'
    },
    children: [
      {
        path: 'index',
        component: () => import('@/views/Soft/Soft.vue'),
        name: 'SoftIndex',
        meta: {
          title: '软件商店',
          icon: 'ep:management',
          noCache: true
        }
      }
    ]
  },
  {
    path: '/site',
    name: 'Site',
    component: Layout,
    meta: {
      title: '网站'
    },
    children: [
      {
        path: 'index',
        component: () => import('@/views/Site/Site.vue'),
        name: 'SiteIndex',
        meta: {
          title: '网站',
          icon: 'bx:bxs-component',
          noCache: true
        }
      }
    ]
  },
]
if (process.env.NODE_ENV !== 'production') {
  asyncRouterMap.push(...localRouter)
}

const router = createRouter({
  history: createWebHashHistory(),
  strict: true,
  routes: constantRouterMap as RouteRecordRaw[],
  scrollBehavior: () => ({ left: 0, top: 0 })
})

export const resetRouter = (): void => {
  const resetWhiteNameList = ['Redirect', 'Login', 'NoFind', 'Root']
  console.log(router,'router')
  router.getRoutes().forEach((route) => {
    const { name } = route
    if (name && !resetWhiteNameList.includes(name as string)) {
      router.hasRoute(name) && router.removeRoute(name)
    }
  })
  console.log(router.getRoutes(),'router.getRoutes()')
}

export const setupRouter = (app: App<Element>) => {
  app.use(router)
}

export default router
